<!DOCTYPE html>
<html lang="en">
<head><meta name="generator" content="Hexo 3.9.0">
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1.0, user-scalable=no">
	<title>我的利，女神节快乐...</title>
	<style>
		*{
			margin: 0;
			padding: 0;
		}
		html,body{
			width: 100%;
			height: 100%;
			
		}
		body{
			position: relative;
			margin: 0 auto;
		}
		canvas{
			width: 100%;
			height: 100%;
			position: absolute;
			left: 0;
			top: 0;
		}
		#bg{
			z-index: 5;
		}
		#firework{
			z-index: 8;
		}
		#title{
			z-index: 9;
		}
		#fall{
			z-index: 10;
		}
		#dialogue{
			z-index: 11;
		}
		#loading{
			width: 100%;
			height: 100%;
			position: absolute;
			left: 0;
			top: 0;
			z-index: 999;
		}
		.title{
			z-index:9;
		}
		#music{
			width: 36px;
			height: 36px;
			background-repeat: no-repeat;
			background-size: 100%;
			position: absolute;
			z-index: 999;
			right: 10px;
			top: 14px;

		}
		@-webkit-keyframes play{
		    0%{transform: rotate(0deg);-webkit-transform: rotate(0deg);}
		    100%{transform: rotate(360deg);-webkit-transform: rotate(360deg);}
		}
		.on{
			background-image: url('./img/musicon.png');
			-webkit-animation:play 1.5s linear both infinite;
		}
		.off{
			background-image: url('./img/musicoff.png');
		}
	</style>
</head>
<body>
	<span class="on" id="music"></span>
	<canvas id="bg">您的浏览器不支持Canvas元素</canvas>
	<canvas id="firework">您的浏览器不支持Canvas元素</canvas>
	<canvas id="fall">您的浏览器不支持Canvas元素</canvas>
	<canvas id="dialogue">您的浏览器不支持Canvas元素</canvas>
	<div id="loading">loading ...</div>
<script type="text/javascript" src="js/main.js"></script></body>
</html>